<template>
  <el-data-table
    :url="url"
    :columns="columns"
    :form="form"
    :onNew="onNew"
    :onEdit="onEdit"
  >
  </el-data-table>
</template>

<script>
  import Axios from 'axios'
  export default {
    name: "tableDemo",
    data() {
      return {
        url: 'http://rap2api.taobao.org/app/mock/161215/api/v1/pageList',
        // full attributes of columns see: http://element.eleme.io/#/zh-CN/component/table#table-column-attributes
        columns: [
          {prop: 'id', label: 'ID'},
          {prop: 'title', label: '标题', width: '200'},
          {prop: 'busTypeName', label: '体裁'},
          {prop: 'stNo', label: '文号'},
          {prop: 'ofPublic', label: '是否公开'},
          {prop: 'ofType', label: '类型'},
          {prop: 'primaryColumnName', label: '主栏目'},
          {prop: 'writeDate', label: '撰写日期'}
        ],
        form: [
          {
            $type: 'select',
            $id: 'backendFramework',
            label: '后端框架',
            rules: [{required: true, message: '请选择后端框架', trigger: 'blur'}],
            $options: ['DUBBO', 'HSF'].map(f => ({label: f, value: f})),
            $el: {
              placeholder: '请选择'
            }
          },
          {
            $type: 'input',
            $id: 'name',
            label: '名称',
            rules: [
              {
                required: true,
                message: '请输入名称',
                trigger: 'blur',
                transform: v => v && v.trim()
              }
            ],
            $el: {placeholder: '请输入'}
          }
        ]
      }
    },
    methods: {
      onNew(data, row) {
        console.log(data, row)
        return Axios.post(
          'http://rap2api.taobao.org/app/mock/161215/api/v1/pageList',
          data
        )
      },
      onEdit(data, row) {
        console.log(data, row)
        return Axios.post(
          'http://rap2api.taobao.org/app/mock/161215/api/v1/pageList',
          data
        )
      },
      // beforeConfirm(data, isNew) {
      //   console.log(data, isNew)
      //
      //   if (isNew) {
      //     console.log(data)
      //     return Axios.post(
      //       'http://rap2api.taobao.org/app/mock/161215/api/v1/pageList',
      //       data
      //     )
      //   } else {
      //     alert('修改不可以发送请求')
      //     return Promise.reject()
      //   }
      // }
    }
  }
</script>

<style scoped>

</style>
